import { Form, Input } from 'antd';
import { ModelerService } from '@/pages/workflow/model/components/modeler/ModelerService';
import { useEffect } from 'react';

export const Condition = (props: { modelerService: ModelerService }) => {
  const [form] = Form.useForm();

  useEffect(() => {
    form.setFieldsValue({
      condition: props.modelerService?.businessObject.conditionExpression?.body,
    });
  }, [props.modelerService.element]);

  return (
    <Form layout="vertical" form={form}>
      <Form.Item label="流转条件" name="condition">
        <Input.TextArea
          onBlur={(event) => {
            props.modelerService.setExtendProperty(
              'bpmn:FormalExpression',
              'conditionExpression',
              'body',
              event.target.value,
            );
          }}
        />
      </Form.Item>
    </Form>
  );
};
